<%@ page language="java" pageEncoding="UTF-8" contentType="text/html;charset=utf-8" %>
<%@include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"  />
<title><fmt:message key='label.home.home.jsp.appname'/></title>
<%@ include file="/common/scripts.jsp"%>
<script>
$(function(){
	$('#mega-menu').dcMegaMenu();
	
	$("#mega-menu").find("a[target=mainFrame]").click(
	    function(){
	    	var $ul = $("#breadCrumb").find("ul").eq(0);
		    var $li0 = $ul.children().eq(0).clone();
		    var $li1 = $("<li>"+$(this).text()+"</li>").addClass("last");
		    $ul.empty();
		    $ul.append($li0);
		    $ul.append($li1);
		}	    
	);		
});
$(function(){  
    $("#dialog").dialog({
        autoOpen: false,
        modal: true,
        buttons: {"<fmt:message key='button.save'/>":function(){
            document.getElementById("myIframe").contentWindow.doSave({
                success:function(){
                    $('#dialog').dialog('close');
                }
            });            
        }}
    });

    $( "#profile_btn" ).click(function(){
        $('#dialog').dialog('open');
        $('#dialog').dialog('option',"title","<fmt:message key='menu.self' />");
        $('#dialog').dialog('option',"height",400);
        $('#dialog').dialog('option',"width",500);
        $('#myIframe').attr("src","<c:url value='/home/self/init'/>");
    });	
    $( "#pwd_btn" ).click(function(){        
        $('#dialog').dialog('open');
        $('#dialog').dialog('option',"title","<fmt:message key='label.home.pwd.jsp.title' />");
        $('#dialog').dialog('option',"height",400);
        $('#dialog').dialog('option',"width",500); 
        $('#myIframe').attr("src","<c:url value='/home/pwd/init'/>");
    });	
    
	var height = $(window).height()- $(".topHeaderContainer").outerHeight();
	$('iframe[name=mainFrame]').height(height + "px");  
	
	$("#mega-menu").find("a:eq(0)").click();
	$('iframe[name=mainFrame]').attr("src",$("#mega-menu").find("a:eq(0)").attr('href'));
});
</script>
<style>
 .ui-dialog { z-index: 1000 !important ;}
</style>
</head>
<body>
    <div class="pageOuter">
        <!--topHeaderContainer-->
        <div class="topHeaderContainer">
            <!--topHeader-->
            <div class="topHeader">
                <!--logo-->
                <div class="topLogoBox">
                    
                </div>
                <a href="<c:url value='/j_spring_security_logout'/>" class="css_btn logout" style="float: right; margin: 5px"><img class="button logout" src="<c:url value='/images/icon_transparent.png'/>" /><fmt:message key="button.logout"/></a>
                <a href="javascript:void(0);" class="css_btn" id="pwd_btn" style="float: right; margin: 5px"><img class="button logout" src="<c:url value='/images/icon_transparent.png'/>" /><fmt:message key='button.change.password'/></a>                 
                <!--login info-->
                <div class="topInfoBox">
                    <img class="icon user" src="<c:url value='/images/icon_transparent.png'/>" /> Hi, <a href="javascript:void(0);" id="profile_btn" target="mainFrame"><span class="userName">${sysUser.username }</span></a>
                </div>
                
                <ul id="mega-menu">
                  <li><a href="<c:url value='/system/sysUser/init'/>" target="mainFrame"><fmt:message key='menu.manage.user'/></a></li>
                  <li><a href="<c:url value='/app/appItem/init'/>" target="mainFrame"><fmt:message key='menu.manage.app'/></a></li>
                  <li><a href="<c:url value='/app/appAdItem/init'/>" target="mainFrame"><fmt:message key='menu.manage.appAd'/></a></li>
                </ul>
            </div>
            <!--breadcrumb start-->
            <div class="breadCrumbHolder module">
                <div id="breadCrumb" class="breadCrumb module">
                    <ul>
                        <li class="first"><a href="javascript:void(0);">Home</a></li>
                        <li class="last"><fmt:message key='menu.welcome'/></li>
                    </ul>
                </div>
            </div>
            <!--breadcrumb end-->
        </div>
        <div id="dialog">
            <iframe id="myIframe" name="myIframe" src="" width="100%" height="100%" frameborder="0"></iframe>
        </div>  
        <iframe width="100%" src="about:blank" name="mainFrame" frameborder="0" scrolling="yes" />
    </div>
</body>
</html>